<%@ taglib prefix="C" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>
<!doctype html>
<html>

<head>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>会员登录</title>
  <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css"
        type="text/css"/>
  <script src="${pageContext.request.contextPath}/js/jquery-2.1.4.min.js"
          type="text/javascript"></script>
  <script src="${pageContext.request.contextPath}/js/bootstrap-3.1.1.min.js"
          type="text/javascript"></script>
  <!-- 引入自定义css文件 style.css -->
  <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css" type="text/css"/>
  <style>
    body {
      margin-top: 20px;
      margin: 0 auto;
    }

    .carousel-inner .item img {
      width: 100%;
      height: 300px;
    }
  </style>
</head>

<body>
<jsp:include page="head.jsp"/>

<div class="container">
  <div class="row">

    <div style="margin:0 auto;margin-top:10px;width:950px;">
      <strong>订单详情</strong>
      <table class="table table-bordered">
        <tbody>
        <tr class="warning">
          <th colspan="5">订单编号:${order.oid}</th>
        </tr>
        <tr class="warning">
          <th>图片</th>
          <th>商品</th>
          <th>价格</th>
          <th>数量</th>
          <th>小计</th>
        </tr>

        <C:forEach items="${order.orderitems}" var="order">
          <tr class="active">
            <td width="60" width="40%">
              <input type="hidden" name="id" value="22">
              <img src="${pageContext.request.contextPath}/${order.product.image}"
                   width="70" height="60">
            </td>
            <td width="30%">
              <a target="_blank">${order.product.name}</a>
            </td>
            <td width="20%">
              ￥${order.product.shopPrice}
            </td>
            <td width="10%">
                ${order.count}
            </td>
            <td width="15%">
              <span class="subtotal">￥${order.subtotal}</span>
            </td>
          </tr>
        </C:forEach>

        </tbody>
      </table>
    </div>

    <div style="text-align:right;margin-right:120px;">
      商品金额: <strong style="color:#ff6600;">￥${order.total}元</strong>
    </div>

  </div>

  <div>
    <hr/>
    <form class="form-horizontal" style="margin-top:5px;margin-left:150px;"
          action="${pageContext.request.contextPath}/order/CompleteOrder.do">
      <input type="text" name="oid" value="${order.oid}" hidden="true">
      <div class="form-group">
        <label for="address" class="col-sm-2 control-label">地址</label>
        <div class="col-sm-5">
          <input type="text" class="form-control" id="address" name="address"
                 placeholder="请输入收货地址" value="">
        </div>
      </div>
      <div class="form-group">
        <label for="username" class="col-sm-2 control-label">收货人</label>
        <div class="col-sm-5">
          <input type="text" class="form-control" id="username" name="username"
                 placeholder="请输收货人" value="">
        </div>
      </div>
      <div class="form-group">
        <label for="phone" class="col-sm-2 control-label">电话</label>
        <div class="col-sm-5">
          <input type="text" class="form-control" id="phone" name="phone"
                 placeholder="请输入联系方式" value="">
        </div>
      </div>

      <hr/>

      <div style="margin-top:5px;margin-left:150px;">
        <%--<strong>选择银行：</strong>--%>
        <%--<p>--%>
        <%--<br/>--%>
        <input type="radio" name="pd_FrpId" value="CMBCHINA-NET-B2C"/>支付宝
        <img src="${pageContext.request.contextPath}/bank_img/zfb.jpg" align="middle"/>

        <%--<input type="radio" name="pd_FrpId" value="CMBCHINA-NET-B2C"/>招商银行--%>
        <%--<img src="/bank_img/cmb.bmp" align="middle"/>--%>

        <%--</p>--%>
        <hr/>
        <p style="text-align:right;margin-left:470px;display: inline-block">
          <button class="btn btn-default" type="button" onclick="pending()">暂时挂起</button>
        </p>
        <p style="text-align:right;margin-left:50px;display: inline-block">
          <button disabled="disabled" type="submit" id="sub" class="btn btn-default">支付订单</button>
        </p>
        <hr/>
      </div>
    </form>
  </div>

</div>

<jsp:include page="foot.jsp"/>

</body>

<script>
  $("#address").blur(function () {
    console.log($("#address").val().length);
    if ($("#address").val().length == 0) {
      $("#sub").attr("disabled", true);
    } else {
      $("#sub").attr("disabled", false)
    }
  })

  function pending() {
    location.href = "${pageContext.request.contextPath}/order/orderlist.do";
  }
</script>
</html>